<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%--
  Created by IntelliJ IDEA.
  User: lenovo
  Date: 2020/8/12
  Time: 21:41
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java"  isELIgnored="false" %>
<html>
<head>
    <title>手机号查单</title>
    <link rel="stylesheet" href="/static/css/reset.css">
    <link rel="stylesheet" href="/user/select.css">
    <%--layui css--%>
    <link rel="stylesheet" href="/static/layui/css/layui.css">
</head>
<body>
<jsp:include page="/public/danhang.jsp"/>
<div class="xc-select-wrapper">
    <h2 class="xc-select-title">手机号查单</h2>
    <div class="xc-content">
        <!--输入账号密码及登录部分-->
        <form action="/api/user/selectUserByPhone"   class="xc-part-register"  method="post">
            <!--输入手机号-->
            <dl class="xc-inputPart">
                <dt class="xc-reg-label">手机号</dt>
                <dd class="xc-code-border">
                    <div class="xc-input-verificationCode">
                        <input  class="xc-reg-inputAccount" type="text" value="${phone}" placeholder="有效手机号" name="user_phone" autocomplete="off" onblur="checkAccount()" id="account">
                        <span  style="font-size:12px;height: 12px;line-height: 12px" id="accountSpan"></span>
                    </div>
                </dd>
            </dl>
            <!--输入验证码-->
            <dl class="xc-inputPart">
                <dt class="xc-reg-label">短信验证码</dt>
                <dd class="xc-code-border">
                    <div class="xc-input-verificationCode">
                        <input class="xc-verificationCode" type="text" placeholder="6位数字" name="user_password" autocomplete="off" id="code">
                        <span  style="font-size:12px;height: 12px;line-height: 12px" id="codeSpan"></span>
                        <button  class="getCode">发送验证码</button>
                        <div class="mm-login-error">${message}</div>
                        <input id="msg" type="text" value="${message}" style="display: none">
                    </div>
                </dd>
            </dl>
            <div class="xc-nextStep">
                <button class="xc-seg-btn" onclick="sameCode()">查&nbsp;找</button>
            </div>
        </form>
    </div>
    <div style="width: 100%;;height: 40px"></div>
</div>
<jsp:include page="/public/footer.jsp"/>

<script>
    //1. 检查输入账户
    var flag = true;
    function checkAccount(){
        var account = document.getElementById("account").value;
        var accountSpan = document.getElementById("accountSpan");
        //
        var reg = /^1[0-9]\d{9}$/i;
        if(reg.test(account)){
            //符合规则
            accountSpan.innerHTML = "";
            return true;
        }else{
            //不符合规则
            accountSpan.innerHTML = "请输入11位长的内地手机号".fontcolor("red");
            return false;
        }
    }

    function sameCode() {
        let code = document.getElementById("code").value;
        let trueCode = document.getElementById("msg").value;
        console.log(trueCode);
        if(code === trueCode){
            alert('查询成功！');
            window.location.href="http://localhost:8090/order/order.jsp";
            window.event.returnValue=false;
            // return true;
        }else {
            alert('输入的验证码有误');
            window.location.href="http://localhost:8090/user/select.jsp";
        }
    }
</script>
</body>
</html>
